<style  lang="less">
    @import 'basic_info';
</style>
<template>
    <div class="page_system_index">
        <el-row :gutter="3" justify="center">
            <el-col :span="16">
                <el-card shadow="hover" v-if="info.sys_arch">
                    <div slot="header" class="head_content">
                        系统环境
                    </div>
                    <el-row class="item_row" :gutter="2">
                        <el-col :span="title_span" class="item_title">
                            运行环境:
                        </el-col>

                        <el-col :span="content_span">
                           OS:{{info.sys_arch.os}}/Erlang_V: {{info.sys_arch.otp_release}}/ERTS_V:{{info.sys_arch.version}}
                        </el-col>

                    </el-row>

                    <el-row class="item_row" :gutter="2">
                        <el-col :span="title_span" class="item_title">
                            系统限制:
                        </el-col>
                        <el-col :span="content_span">
                            <span style="font-weight:bolder">进程</span>:<i style="color: #42b983">{{info.limit.process_count}}</i>/<i style="color: red">{{info.limit.process_limit}}</i>
                            &nbsp;&nbsp;<span style="font-weight:bolder">ETS</span>:<i style="color: #42b983">{{info.limit.ets_count}}</i>/<i style="color: red">{{info.limit.ets_limit}}</i>
                            &nbsp;&nbsp;<span style="font-weight:bolder">原子</span>:<i style="color: #42b983">{{info.limit.atom_count}}</i>/<i style="color: red">{{info.limit.atom_limit}}</i>
                            &nbsp;&nbsp; <span style="font-weight:bolder">端口</span>:<i style="color: #42b983">{{info.limit.port_count}}</i>/<i style="color: red">{{info.limit.port_limit}}</i>
                        </el-col>
                    </el-row>

                    <el-row class="item_row" :gutter="2">
                        <el-col :span="title_span" class="item_title">
                            内存使用
                        </el-col>
                        <el-col :span="content_span" style="font-size: 8px">
                            内存:{{total_mem}}
                            原子:{{atom_mem}}
                            二进制:{{binary_mem}}
                            内存表:{{ets_mem}}
                            进程:{{process_mem}}
                        </el-col>
                    </el-row>

                    <el-row class="item_row" :gutter="2">
                        <el-col :span="title_span" class="item_title">
                            系统统计
                        </el-col>
                        <el-col :span="content_span">
                            进程数:{{info.statistics.process_count}}
                            IO_IN:{{io_input_mem}}
                            IO_OUT:{{io_output_mem}}
                        </el-col>
                    </el-row>


                    <el-row class="item_row" :gutter="2">
                        <el-col :span="title_span" class="item_title">
                            Uptime
                        </el-col>
                        <el-col :span="content_span">
                            {{up_time}}
                        </el-col>
                    </el-row>

                </el-card>
            </el-col>
            <el-col :span="8">
                <el-card shadow="hover" >
                    <div slot="header" class="head_content">
                        系统信息
                    </div>
                    <el-row class="item_row" :gutter="2">
                        <el-col :span="title_span" class="item_title">
                            版本信息
                        </el-col>
                        <el-col :span="content_span">
                           飞天 1.0.0
                        </el-col>
                    </el-row>


                    <el-row class="item_row" :gutter="2">
                        <el-col :span="title_span" class="item_title">
                            授权信息
                        </el-col>
                        <el-col :span="content_span">
                            <span v-if="is_active" style="color: #55a532">已授权
                            </span>
                            <span v-else style="color: darkred">未授权,请支持正版</span>
                        </el-col>
                    </el-row>

                    <el-row class="item_row" :gutter="2">
                        <el-col :span="title_span" class="item_title">
                            客服信息
                        </el-col>
                        <el-col :span="content_span">
                            客服名称:himq 客服电话:029-83335256
                        </el-col>
                    </el-row>


                    <el-row class="item_row" :gutter="2">
                        <el-col :span="title_span" class="item_title">
                            官网地址:
                        </el-col>
                        <el-col :span="content_span">
                            <a style="font-size: 12px" :underline="false" href="http://www.himq.org">西安小码头软件科技</a>
<!--                            西安小码头软件科技-->
                        </el-col>
                    </el-row>


                    <el-row class="item_row" :gutter="2">
                        <el-col :span="title_span" class="item_title">
                            帮助中心:
                        </el-col>
                        <el-col :span="content_span">
                            <a style="font-size: 12px" :underline="false" href="http://www.himq.org">转到帮助中心</a>
                        </el-col>
                    </el-row>

                </el-card>
            </el-col>
        </el-row>
    </div>
</template>

<script>
    import {sys_info} from "../api/himq_http";
    import {bytesToSize, formatSeconds} from "../comm/utils";

    export default {
        name: "AdminIndex",
        data() {
            return {
                limit_data:[
                    {name:"limit"}
                ],
                loading: false,
                info: {
                    memory_use: {
                        total: "37651112",
                        processes: "9158872",
                        atoms: "553593",
                        binaries: "4168272",
                        ets: "1174888"
                    },
                    statistics: {
                        up_time: "592613",
                        process_count: "268",
                        run_queue: "0",
                        io_input: "60811",
                        io_output: "43648"
                    },
                    sys_arch: {
                        otp_release: "22", version: "10.5.5", os: "x86_64-apple-darwin19.0.0", process_limit: "262144",
                        schedulers_available: "8",
                        smp: "true",
                    },
                    limit: {
                        atom_count: "19439",
                        atom_limit: "1048576",
                        dist_buf_busy_limit: "1048576",
                        ets_count: "47",
                        ets_limit: "8192",
                        port_count: "17",
                        port_limit: "65536",
                        process_count: "268",
                        process_limit: "262144"
                    }
                },
                title_span: 4,
                content_span: 20,
                is_active:false,
            }
        },
        created() {
            this.getData()
        },
        computed:{
            atom_mem:function () {
                return bytesToSize(this.info.memory_use.atoms)
            },
            binary_mem:function () {
                return bytesToSize(this.info.memory_use.binaries)
            },
            process_mem:function () {
                return bytesToSize(this.info.memory_use.processes)
            },
            total_mem:function () {
                return bytesToSize(this.info.memory_use.total)
            },
            ets_mem:function () {
                return bytesToSize(this.info.memory_use.ets)
            },
            io_input_mem:function () {
                return bytesToSize(this.info.statistics.io_input)
            },
            io_output_mem:function () {
                return bytesToSize(this.info.statistics.io_output)
            },
            up_time:function () {
                return formatSeconds(this.info.statistics.up_time/1000)
            }
        },
        methods: {
            getData() {
                this.loading = true;
                let that = this;
                sys_info({}).then(
                    resp => {
                        that.loading = false;
                        that.info = resp.data;
                        console.log(resp.data)
                    }, err => {
                        that.loading = false;
                        console.log(err.message)
                    }
                )
            },
        }
    }
</script>
